<ion-content style="--background:transparent ;">
    <div class="compute-report" [ngStyle]="tagData.cssStyle | styleFilter">
        <div class="headData" *ngIf="tagData.headData && tagData.headData.length > 0">
            <p class="headData-title" *ngIf="tagData.headData[0].title" [ngStyle]="tagData.headData[0].cssStyle | styleFilter">
                {{tagData.headData[0].title}}</p>
            <div class="headData-item-content">
                <ng-container *ngFor="let item of tagData.headData;let i = index;">
                    <div *ngIf="!item.title" class="h-item" [ngStyle]="item.cssStyle | styleFilter">
                        <span class="h-label" *ngIf="item.label"
                            [ngStyle]="item.labelCssStyle | styleFilter">{{item.label}}</span>
                        <span class="h-value" *ngIf="item.value && i !== 2"
                            [ngStyle]="item.valueCssStyle | styleFilter">{{getInterger(item.value - 0 )|
                            currency:'CNY':'':'1.0-0'}}<i class="pirce-digits">{{(item.value - 0 |
                                currency:'CNY':'':'0.2-2') + '' | slice:-3}}</i></span>
                        <span class="h-value" *ngIf="item.value && i === 2"
                            [ngStyle]="item.valueCssStyle | styleFilter">{{item.value}}</span>
                        <span class="sub">
                            <span class="label" *ngIf="item.subLabel"
                                [ngStyle]="item.subLabelCssStyle | styleFilter">{{item.subLabel}}</span>
                            <span class="value" *ngIf="item.subValue" [ngStyle]="item.subValueCssStyle | styleFilter"
                                [ngClass]="{'red':item.class === 0,'green':item.class === 1}">{{item.subValue}}</span>
                        </span>
                    </div>
                </ng-container>
            </div>
        </div>

        <div class="bodyData" *ngIf="tagData.data?.bodyData && tagData.data?.bodyData.length > 0">
            <p class="title">{{tagData.data.headData?.title}}</p>
            <p class="top-label" *ngIf="tagData.data?.headData?.data">
                <ng-container *ngFor="let item of tagData.data.headData.data">
                    <span class="top-label-text" *ngIf="item.label" [ngStyle]="item.labelCssStyle| styleFilter">{{item.label}}</span>
                </ng-container>
            </p>
            <div class="item-content" *ngIf="tagData.data?.bodyData">
                <ng-container *ngFor="let ite of tagData.data.bodyData">
                    <p class="item" [ngStyle]="ite.itemCssStyle | styleFilter">
                        <span class="b-title" *ngIf="ite.titleDate"
                            [ngStyle]="ite.titleCssStyle | styleFilter">{{ite.titleDate}}</span>
                        <span class="count" *ngIf="ite.count"
                            [ngStyle]="ite.countCssStyle | styleFilter">{{ite.count}}</span>
                        <span class="price" *ngIf="ite.price !== undefined"
                            [ngStyle]="ite.priceCssStyle | styleFilter">{{ite.unit}}{{getInterger(ite.price - 0 )|
                            currency:'CNY':'':'1.0-0'}}<i class="pirce-digits">{{(ite.price - 0 | currency:'CNY':'':'0.2-2')
                                + '' | slice:-3}}</i></span>
                    </p>
                </ng-container>
            </div>
        </div>

        <div class="headData 2" *ngIf="tagData.headData?.data && tagData.headData.data.length > 0">
            <p class="headData-title" *ngIf="tagData.headData.data[0]?.title"
                [ngStyle]="tagData.headData.data[0]?.cssStyle | styleFilter">{{tagData.headData.data[0]?.title}}<span
                    [ngStyle]="tagData.headData.data[0]?.labelCssStyle | styleFilter">{{tagData.headData.data[0]?.label}}</span>
            </p>
            <div class="goodsClass headData-item-content" appDebounceClick (debounceClick)="openPage(tagData.headData?.link)">
                <ng-container *ngFor="let item of tagData.headData.data;let i = index;">
                    <div *ngIf="!item.title" class="h-item" [ngStyle]="item.cssStyle | styleFilter">
                        <div>
                            <img *ngIf="item.icon" [src]="item.icon" [ngStyle]="item.iconCssStyle | styleFilter" />
                            <span class="h-label" *ngIf="item.label"
                                [ngStyle]="item.labelCssStyle | styleFilter">{{item.label}}</span>
                        </div>
                        <span class="h-value" *ngIf="item.value"
                            [ngStyle]="item.valueCssStyle | styleFilter">{{item.value}}</span>
                    </div>
                </ng-container>
            </div>
        </div>

        <div class="bodyData 2" *ngIf="tagData.data?.bodyData?.data && tagData.data?.bodyData?.data.length > 0">
            <p class="title">{{tagData.data?.title}}</p>
            <div class="item-content" *ngIf="tagData.data?.bodyData?.data" appDebounceClick (debounceClick)="openPage(tagData.data?.bodyData?.link)">
                <ng-container *ngFor="let ite of tagData.data.bodyData.data">
                    <span class="title" *ngIf="ite.titleDate"
                        [ngStyle]="ite.titleCssStyle | styleFilter">{{ite.titleDate}}</span>
                    <p class="item" [ngStyle]="ite.itemCssStyle | styleFilter">
                        <img *ngIf="ite.icon" [src]="ite.icon" [ngStyle]="ite.iconCssStyle | styleFilter" />
                        <span class="goods" *ngIf="ite.goodsName"
                            [ngStyle]="ite.goodsNameCssStyle | styleFilter">{{ite.goodsName}}</span>
                        <span class="price" *ngIf="ite.price"
                            [ngStyle]="ite.priceCssStyle | styleFilter">{{ite.unit}}{{getInterger(ite.price - 0 )|
                            currency:'CNY':'':'1.0-0'}}<i class="pirce-digits">{{(ite.price - 0 | currency:'CNY':'':'0.2-2')
                                + '' | slice:-3}}</i></span>
                    </p>
                    <p class="specs">
                        <span *ngIf="ite.brandName" class="brand"
                            [ngStyle]="ite.brandNameCssStyle | styleFilter">{{ite.brandName}}</span>
                        <span *ngIf="ite.goodsValue" class="goodsValue"
                            [ngStyle]="ite.goodsValueCssStyle | styleFilter">{{ite.goodsValue}}</span>
                        <span class="count" *ngIf="ite.count"
                            [ngStyle]="ite.countCssStyle | styleFilter">{{ite.count}}</span>
                    </p>
                </ng-container>
            </div>
        </div>

    </div>

    <div class="noData"
        *ngIf="(tagData.data?.headData?.length < 1) && (tagData.data?.headData?.data?.length < 1) && (tagData.data?.bodyData?.length < 1) && (tagData.headData?.data !== undefined && tagData.headData?.data?.length < 1)">
        <span>暂无数据</span>()
    </div>

    <ion-infinite-scroll *ngIf="tagData.data.submit" threshold="5%" (ionInfinite)="loadData($event)">
        <ion-infinite-scroll-content loadingSpinner="crescent" loadingText="正在加载更多数据...">
        </ion-infinite-scroll-content>
    </ion-infinite-scroll>
</ion-content>
